$(function () {
    var menuList = {
        "0": "我的资料,../html/myuserInfo.html",
        "1": "修改密码,",
        "2": "添加角色,../html/RoleAdd.html",
        "3": "修改个人信息,",
        "4": "修改角色信息,"
    }
    //页面效果JS
    //小标题鼠标悬停变背景色
    function performSmall() {
        $(".menu").mouseover(function () {
            $(this).css("background", "rgba(218, 216, 230, 0.5)");
            $(this).css({
                color: "white"
            });
        });
        $(".menu").mouseout(function () {
            //如果离开的是被点击标题则不恢复样式
            if ($(this).attr("value") == 1) {
                return;
            }
            $(this).css("background", "");
            $(this).css({
                color: "rgb(162, 194, 194)"
            });
        });
        //小菜单点击之后样式固定
        $(".menu").click(function () {
            var obj = $(this);
            $.each($(".menu"), function () { //点击后首先把所有标题样式还原
                $(this).attr("value", null);     //取消所有标题被点击标志
                $(this).css("background", "");
                $(this).css({color: "rgb(162, 194, 194)"});
            });
            //当前点击标题样式变化
            $(this).css("background", "rgba(218, 216, 230, 0.5)");
            $(this).css({color: "white"});
            //给当前点击标题添加被点击标志
            obj.attr("value", "1");
            var state = $(this).attr("state");
            /////////////////////////////////   点击加载交易代码  js html  css  ////////////////////////////////
            //小菜单点击之后要隐藏副框架 显示主框架


            var url = menuList[state].split(",")[1];
            $("#iframe1").attr("src", url);
        })

    }

    //大标题鼠标悬停变背景色
    $(".menu_main").mouseover(function () {
        $(this).css({
            background: "url(../images/high_Light_Background.png)"
        });
        $(this).css({
            color: "white"
        });
    })
    $(".menu_main").mouseout(function () {
        if ($(this).attr("value") == 1) {
            return;
        }
        $(this).css("background", "");
        $(this).css({
            color: "rgb(139, 153, 153)"
        });
    })
    //大菜单点击之后样式固定
    $(".menu_main").click(function () {
        var obj = $(this);
        $.each($(".menu_main"), function () { //点击后首先把所有标题样式还原
            $(this).attr("value", null);     //取消所有标题被点击标志
            $(this).css("background", "");
            $(this).css({color: "rgb(139, 153, 153)"});
        });
        //当前点击标题样式变化
        $(this).css({
            background: "url(../images/high_Light_Background.png)"
        });
        $(this).css({
            color: "white"
        });
        //给当前点击标题添加被点击标志
        obj.attr("value", "1");
        //发送请求 从服务器端获取菜单
        var state = obj.attr("state");
        $.ajax({
            type: "GET",
            url: "/blog/public/getMenu",
            data: {
                "state": state
            },
            dataType: "JSON",
            success: function (response) {
                var data = response.data;
                var menu = "";
                for (var key in data) {
                    menu += "<div class='menu' state='" + key + "'>" + data[key] + "</div>";
                }
                $("#lead_myInfo").html(menu);
                performSmall();  //给小标题菜单添加样式
                $(".menu:eq(2)").click();
            }
        });
    })
    ///////////////////////////////////////////////默认点击我的资料/////添加角色////
    $(".menu_main:eq(4)").click();   ///触发点击事件


})